<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <!--引入Vue-->
  <script type="text/javascript" src="../js/vue.js"></script>
  <title></title>
</head>
<body>
  <!--准备好一个容器-->
  <div class="root">
    <h2>当前的n的值是:{{n}}</h2>
    <button @click="n++">点我n+1</button>
    <h1>欢迎来到{{name}} v-show:true</h1>
    <br/>
    <div v-if="n===1">Angular</div>
    <div v-if="n===2">React</div>
    <div v-if="n===3">Vue</div>

  <div v-if="n<=3">n<=3的时候显示</div>
  <div v-else="n===4">跟了也白跟</div>
  </div>
  

  <script type="text/javascript">
    Vue.config.productionTip=false;

    new Vue({
      el:'.root',
      data:{
        name:'南理工泰科院呵呵',
        a:true,
        n:0
      }
    })
  </script>
</body>
</html>